{include file="public/header"}
        <style scoped>
            .el-select-dropdown {
            padding: 0;
            }
        </style>
         {include file="public/style"}
        <el-breadcrumb separator="/">
            <el-breadcrumb-item>首页</el-breadcrumb-item>
            <el-breadcrumb-item>系统管理</el-bread crumb-item>
            <el-breadcrumb-item>售后模板</el-breadcrumb-item>
        </el-breadcrumb>
        <br>
        <el-card > 
             <div style="display: flex;align-items: center;justify-content: flex-start;">
                <el-form :inline="true" :model="searchForm" size="small"  ref="refsearchForm">
                
                          
                    <el-form-item label="店铺名称">
                        <el-select v-model="searchForm.shop_id" placeholder="请选择店铺名称" filterable clearable>
                            <el-option v-for="item in shop" :key="item.value" :label="item.label" :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>     
             
                    <el-form-item>
                        <el-button type="primary"  size="small" plain @click="getSearch"  icon="el-icon-search" v-cloak>查询</el-button>
                    </el-form-item>
                </el-form>             
            </div>
            <el-table :data="tablelist"   style="width: 100%;margin-bottom: 20px;"  row-key="id"  border >
                <el-table-column   prop="id" label="ID" width="80"> </el-table-column>
                <el-table-column   prop="shop_name" label="所属店铺" min-width="280"> </el-table-column>   
                <el-table-column   prop="shippingmodelid" label="运费模板id" min-width="280"> </el-table-column>   
                <el-table-column   prop="modelname" label="模板名称" min-width="280"> </el-table-column> 
               <el-table-column   prop="modelitems" label="模版概要描述 " min-width="380"></el-table-column>            
                <el-table-column   prop="isDHPort"  label="是否是海外直发模版" > 
                    <template v-slot="{row}">
                        <span v-if="row.isDHPort===1">
                               是
                            </span>
                            <span   v-if="row.isDHPort===0">
                               不是                              
                        </span>   
                    </template>                          
                </el-table-column>
           
            </el-table>
            <!-- page -->          
        </el-card>   
  
    </div>

    <script>
        new Vue({
            el: '#app',
            data: function () {
                return {    
                    shop:[],
                    total:0,   //分页总页数      
                    tablelist:[] ,              
                    searchForm: { 
                        pagenum: 1,
                        pagesize: 20, 
                    },      
                   
                }
            },
            mounted(){        
                this.getSearch()
            },
            methods: {        

                async getDatalist() {
                    const res = await axios.post('/admin/Logistics/logistice_template', {params: this.searchForm})
                        if (res.status !== 1) {
                            return this.$message.error(res.info);
                        }
                    this.total = res.info.total
                    this.tablelist = res.info

                },
                    
                handleSizeChange(newSize) {
                    this.searchForm.pagesize = newSize
                    this.getDatalist()
                },
                handleCurrentChange(newPage) {
                    this.searchForm.pagenum = newPage
                    this.getDatalist()
                },
                    
                getSearch() {
                    this.searchForm.pagenum = 1
                    this.getDatalist()
                },
            
           
            }   
        })
    </script>
</body>  
</html>
